<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/vue.js"></script>
	</head>
	<body>
		<!-- 
		 判断data.name是否是数据代理
			getter 修改data.name 是否会影响 vm中的name值
			setter vm中的name值被修改，是否会影响 data.name
			1、Vue中的数据代理：
				通过vm对象来代理data对象中属性的操作（读/写）
			2、Vue中数据代理的好处：
				更加方便的操作data中的数据
			3、基本原理：
				通过Object.defineProperty() 把data对象中所有属性添加到vm上
				为每一个添加到vm上的属性，都设置getter和setter
				在getter/setter内部去操作（读/写）data中对应的属性
		 -->
		<div id="root">
			<h1>公司名称：{{name}}</h1>
		</div>
	</body>
	<script>
		Vue.config.productionTip = false
		const wm = new Vue({
			el:'#root',
			data:{
				name:'华清远见'
			}
		})
		
		
	</script>
</html>